<!DOCTYPE html> 
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Clock</title>
<style>
#time{
	font-size:250px;
	color: rgb(255,155,0);
}
body{
	background-color: black;
	font-family: Arial, Helvetica, sans-serif;
	text-align: center;
	background-image: url("background.jpg");
	background-position: center;
	background-attachment: fixed;
	background-repeat: no-repeat;
	
}
</style>
</head>

<body onload="startTime()">
	<script>
		function startTime() {
			var today=new Date();
			var h=today.getHours();
			var m=today.getMinutes();
			var s=today.getSeconds();
			m = checkTime(m);
			s = checkTime(s);
			document.getElementById('time').innerHTML = h+" : "+m+" : "+s;
			var t = setTimeout(function(){startTime()},500);
		}
		function checkTime(i) {
			if (i<10) {i = "0" + i};  // add zero in front of numbers < 10
			return i;
		}
	</script>
	<div id="time">
	</div>
</body>